

root { 
    display: block;
    font-family: Helvetica,Arial,sans-serif;
}

html, body {
    height: 100%;
}

#page {
    position: relative;
    background-image: url("images/bg_1920x1200.jpg");
    background-repeat: no-repeat;
    background-attachment: fixed;
    min-height: 100%;
    margin: auto;
}

* html #page {
    height: 100%;
}

#pagelog {
    position: relative;
    background-image: url("images/procesosE.jpg");
    background-repeat: no-repeat;
    background-attachment: fixed;
    min-height: 100%;
    min-width: 100%;
    width: 400px;
    height: 500px;
    
}
* html #pagelog {
    height: 100%;
    width: 100%;
}

#pagereg {
    position: relative;
    background-image: url("images/construccion.jpg");
    background-repeat: no-repeat;
    background-attachment: fixed;
    min-height: 100%;
    min-width: 100%;
    width: 400px;
    height: 500px;
    
}
* html #pagereg {
    height: 100%;
    width: 100%;
}

.ui-block-b ul {
    width: 150px;
}

.ui-block-b ul li {
    float: left;
}

.menu {
    position: fixed;
    left: 30px;
    width: 200px;
    background-color: rgba(255, 255, 255, 0.6);
    border-radius: 10px;
}
.inici {
    position: fixed;
    top: 30%;
    left: 20%;
    width: 60%;
    color: white;
    border-radius: 10px;
}

.menu .titulo {
    position: relative;
    top: 8px;
    text-transform:  uppercase;
    font-weight:  bold;
    text-align:  center;
}

.centro {
    position: relative;
    width: 780px;
    height: 100%;
    min-height: 100%;
    margin: 0 auto 0 auto;
    padding: 10px;
    background-color: rgba(255, 255, 255, 0.85);
    border-radius: 10px;
    text-align: justify;
}

label.error {
    color: red;
    font-size: 16px;
    font-weight: normal;
    line-height: 1.4;
    margin-top: 0.5em;
    width: 100%;
    float: none;
}

@media screen and (orientation: portrait){
    label.error { margin-left: 0; display: block; }
}

@media screen and (orientation: landscape){
    label.error { display: inline-block; /*margin-left: 22%;*/ }
}

em { color: red; font-weight: bold; padding-right: .25em; }

td {
    border: 1px solid black;
}

.ui-content {
    position: relative;
    min-height: 100%;
}

.autores {
    position: relative;
    bottom: 0px;
    text-align: center;
    width: 500px;
    padding: 10px;
    margin: 20px auto 0px auto;
    background-color: rgba(255, 255, 255, 0.85);
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

.clearer {
    clear: both;
}

.fadein { 
    position:relative;
    overflow: hidden;
    float: left;
    width: 350px; 
    height: 332px; 
    z-index: 0;
    border: 2px solid #888;
    margin: 0 0 0 5px;
    margin: 10px;
}
.log {
    position:relative;
    float: right;
    width: 400px; 
    height: 200px;
    border: none;
}
table.logi {
    border: none;
    width: 100%;
    height: 100%;
    
}
table.logi td {
    border: none;
   
}

.fadein img { 
    position:absolute; 
    left:0; 
    top:0;
    width: 100%;
    height: 100%;
}

#titulo {
    font-weight: bold;
    margin-top: 5px;
}

#fuente {
    font-size: 75%;
    color: #888;
    margin: -16px 0 16px 0;
}

table.valores {
    border: none;
    width: 100%;
}

table.valores td {
    border: none;
    padding: 0 30px;
}

/* http://stackoverflow.com/questions/3790935/can-i-hide-the-html5-number-inputs-spin-box#answer-4298216 */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    display: none;
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

#SwipeWidnow {
    margin: auto;
    width: 780px;
    padding-bottom: 10px;
}

.SwipeTitle_bar {
    height: 25px;
    width: 100%;
    border-bottom:solid 1px;
    font-weight:bold;
}

.SwipeButton {
    border-right:solid 1px;
    margin-right: 5px;
    width: 25px;
    height: 25px;
    float: left;
    cursor:pointer;
    font-size: 24px;
    font-weight:bold;
    text-align: center;
}

.SwipeBox {
    display: none;
    height: auto;
    margin: 0px 30px 0px 30px;
    text-align: justify;
}

#imgTablaPo, #imgMM1for1, #imgMM1for2, #imgMMSfor1, #imgMMSfor2, #imgMMSfor3, #imgPerlang {
    position: relative;
    margin: 10px auto;
    width: 100%;
}

#imgTablaPo {
    height: 800px;
}
#imgPerlang{
   height: 138px; 
}

#imgMM1for1, #imgMM1for2 {
    height: 493px;
}

#imgMMSfor1 {
    height: 482px;
}

#imgMMSfor2 {
    height: 495px;
}

#imgMMSfor3 {
    height: 515px;
}
#resultados {
    width: 300px;
    position: relative;
    margin: auto;
    text-align:  center;
}

.log {
    width: 350px;
    margin: 0 25px 0 25px;
}